<div class="list-container">
   <div class="pt-3 pb-0 pr-3 pl-3 back"> <img src="/images/left-arrow.svg"
      width="20" height="20" class="d-inline-block align-top" alt="">
      <a href="/orders">Orders </a>
   </div>
   <h4 class="p-3 m-0">Order Detail</h4>
   <div class="row m-0 order-detail lineitem">
      <div class="col-12">
        <div class="row">
            <div class="col-6">
               <h2>Order from <%= order_user_name(@order) %></h2>
               <div class="orderon"><span class="mr-2"><%= @order.number %></span> via Avia</div>
               <div class="orderon">
                <span class="mr-1"><%= order_item_count(@order) %>,</span>
                <span><%= @order_total %></span>
               </div>
            </div>
            <div class="col-6">
              <div class="row">
                <div class="col-7"></div>
                <div class="col-5">
                    <div class="orderhead">Ship Details</div>
                    <div class="orderon">Ordered <%= format_date(@order.updated_at) %></div>
                    <div class="orderon">Ship to <%= get_country_state(@order) %></div>
                </div>
              </div>
            </div>
         </div>
         <div class="my-3 order-btns">
            <div class="btn-group">
              <button class="btn btn-outline-secondary btn-md dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                Order Actions
              </button>
              <div class="dropdown-menu">
                <%= link "Pending", to: order_package_path(@conn, :update_package,
                    @order.id, [state: :processing]), method: :put, class: "dropdown-item" %>
                <%= link "Ready", to: order_package_path(@conn, :update_package,
                    @order.id, [state: :ready]), method: :put, class: "dropdown-item" %>
                <%= link "Ship", to: order_package_path(@conn, :update_package,
                    @order.id, [state: :shipped]), method: :put, class: "dropdown-item" %>
                <div class="dropdown-divider"></div>
                <%= if check_for_cod(@order) do %>
                  <% cod_status = cod_status(@order)%>
                  <%= link cod_status.display, to: order_cod_update_path(@conn, :cod_payment_update,
                    @order.id, [state: cod_status.state]), method: :put, class: "dropdown-item" %>
                <% end %>
                 <%= link "Mark as Delivered", to: order_package_path(@conn, :update_package,
                    @order.id, [state: :delivered]), method: :put, class: "dropdown-item" %>
                <%= link "Mark as Complete", to: order_state_path(@conn, :update_state,
                    @order.id, [state: :complete]), method: :put, class: "dropdown-item" %>
                </div>
            </div>
         </div>
         <h3 class="mt-3">Print</h3>
         <div class="card col-12 print">
            <div class="print-sub-head">What would you like to print?</div>
            <div class="media lineitem-detail mx-3">
               <div class="media-body">
                  <a class="mt-0 text-capitalize name">Packing slips</a>
                  <div class="variant">
                    Print the packing slips for the order.
                  </div>
               </div>
               <a class="btn btn-primary float-right" style="width: 100px;" href="/orders/<%= @order.number %>/download-packing-slip" > Download </a>
            </div>
            <div class="media lineitem-detail mt-3 mx-3">
               <div class="media-body">
                  <a class="mt-0 text-capitalize name">Order Invoice</a>
                  <div class="variant">
                    Download the order invoice.
                  </div>
               </div>
               <a class="btn btn-primary float-right " style="width: 100px;" href="/orders/<%= @order.number %>/download-invoice"> Download</a>
            </div>
            <div class="media lineitem-detail mt-3 mx-3">
               <div class="media-body">
                  <a class="mt-0 text-capitalize name">Show Packing Slip</a>
                  <div class="variant">
                    Preview the packing slip.
                  </div>
               </div>
               <a class="btn btn-primary float-right " style="width: 100px;" href="/orders/<%= @order.number %>/show-packing-slip">Show</a>
            </div>
         </div>
         <h3 class="mt-3">Shipping Details</h3>
         <div class="card col-12">
            <div class="row">
               <div class="col-4">
                  <div class="address">
                     <div class="ship mb-3"> Ship to </div>
                     <%= render_address(@order.shipping_address) %>
                  </div>
               </div>
               <div class="col-8">
                  <div class="address">
                     <div class="ship mb-3"> Shipping Method Selected </div>
                     <div class="std-shipping">
                        <div class="float-left">
                          <%= shipping_method(@order) %>
                        </div>
                        <div class="float-right ship ">
                          <%= @order_total %>
                        </div>
                        <div class="clearfix"></div>
                     </div>
                     <%= for line_item <- @order.line_items do %>
                     <div class="media mt-3 lineitem-detail">
                        <a class="pr-3" href="#">
                          <img src="/images/empty-img.png" alt="Default">
                        </a>
                        <div class="media-body">
                          <div class="mt-0 text-capitalize"><%= line_item.product.name %></div>
                        </div>
                        <div class="ship" >
                          Qty <span>1</span>
                        </div>
                     </div>
                     <% end %>
                  </div>
               </div>
            </div>
         </div>
         <h3 class="mt-3">Receipt # <%= @order.number %></h3>
         <div class="card col-12">
            <div class="table-responsive mt-2">
               <table class="table">
                  <thead>
                     <tr class="d-flex">
                        <th class="col-8">Items</th>
                        <th class="col-2 text-center">Quantity</th>
                        <th class="col-2 text-right">Item Price</th>
                     </tr>
                  </thead>
                  <tbody>
                    <%= for line_item <- @order.line_items do %>
                      <tr class="d-flex">
                          <td class="col-8 text-left">
                            <div class="media lineitem-detail">
                                <a class="pr-2 mr-1" href="#" >
                                <img href="#" src="/images/empty-img.png" alt="Default">
                                </a>
                                <div class="media-body">
                                  <a class="mt-0 text-capitalize name"> <%= line_item.product.name %></a>
                                  <div class="variant">
                                  </div>
                                </div>
                            </div>
                          </td>
                          <td class="col-2"><%= line_item.quantity %></td>
                          <td class="col-2 text-right"><%= line_item.unit_price %></td>
                      </tr>
                      <tr class="d-flex">
                      <td class="col-10 text-left" colspan="2">Item Total</td><td class="col-2 text-right"><%= line_item_total(line_item) %></td>
                      </tr>
                     <% end %>
                  </tbody>
               </table>
            </div>
            <div class="row m-0 summery-datail">
                  <div class="col-6 left">
                     Shipping cost
                  </div>
                  <div class="col-6 right">
                     <%= shipping_total(@order) %>
                  </div>
               </div>
               <div class="row m-0 total">
                  <div class="col-6 left">
                     <div>Tax</div>
                     <div class="total-text">Order total</div>
                  </div>
                  <div class="col-6 right">
                     <div> <%= tax_total(@order) %> </div>
                     <div class="total-text"> <%= @order_total %></div>
                     <div class="paid-via mt-4">
                      <%= for payment <- @order.payments do %>
                        <div class="">
                            Paid via <b> <%= get_payment_name(payment) %></b>
                        </div>
                        <div class="n-paid">
                           Status <%= payment.state %>
                        </div>
                        <% end %>
                     </div>
                  </div>
               </div>
         </div>
      </div>
</div>
